<div class="style1-header large-header">Edit Profile</div>
<c:if test="${isBasicSelected}">
	<div id="tab-content-pe-basic" class="tab-content active">
		<zzzzzz-ui:message key="msg_success_update_pe_basic" type="success"/>
		
		<form:form id="pe-basic-form" method="post" modelAttribute="editProfileBasicVo" action="${ctx}/profile_edit?tab=basic" class="pe-basic-form">
			<form:errors path="*" element="div" cssClass="msg-error"/>
			<div class="fieldset">
				<label class="column of-five" for="pe-basic-firstname">First Name</label>
				<form:input path="firstName" id="pe-basic-firstname" name="pe-basic-firstname" size="255" maxlength="255" class="double-column column of-five"/>
			</div>
			<div class="fieldset">
				<label class="column of-five" for="pe-basic-lastname">Last Name</label>
				<form:input path="lastName" id="pe-basic-lastname" name="pe-basic-lastname" size="255" maxlength="255" class="double-column column of-five"/>
			</div>
			<div class="fieldset">
				<label class="column of-five" for="pe-basic-username">Username</label>
				<form:input path="username" id="pe-basic-username" name="pe-basic-username" size="255" maxlength="255" class="double-column column of-five"/>
			</div>
			<div class="fieldset">
				<label class="column of-five" for="pe-basic-aboutme">About Me</label>
				<form:textarea path="aboutMe" id="pe-basic-aboutme" name="pe-basic-aboutme" class="column" />
			</div>
			<div class="fieldset">
				<label class="column of-five" for="pe-basic-dob">Date of Birth</label>	
				<form:select path="day" id="pe-basic-dob-day"><form:option value="" label="Day" /><form:options items="${dayOptions}" itemLabel="dayLabel" itemValue="dayValue"/></form:select><span>&nbsp;</span><form:select path="month" id="pe-basic-dob-month"><form:option value="" label="Month" /><form:options items="${monthOptions}" itemLabel="monthLabel" itemValue="monthValue"/></form:select><span>&nbsp;</span><form:select path="year" id="pe-basic-dob-year"><form:option value="" label="Year" /><form:options items="${yearOptions}" itemLabel="yearLabel" itemValue="yearValue"/></form:select>
			</div>
			<div class="fieldset">
				<label class="column of-five" for="pe-basic-gender">Gender</label>
				<form:select path="gender" id="pe-basic-gender"><form:option value="" label="" /><form:options items="${genderOptions}" itemLabel="genderLabel" itemValue="genderValue"/></form:select>
			</div>
			<div>
				<span class="column of-five"></span>
				<input type="submit" class="style3-button medium-button button" name="submit" value="Save Changes" id="pe-basic-save" />
			</div>
		</form:form>
	</div>
</c:if>
<c:if test="${isPhotoSelected}">
	<div id="tab-content-pe-photo" class="tab-content active">
		<h2>Photo</h2>
	</div>
</c:if>
<c:if test="${isContactSelected}">
	<div id="tab-content-pe-contact" class="tab-content active">
		<zzzzzz-ui:message key="msg_success_update_pe_contact" type="success"/>
		<form:form id="pe-contact-form" method="post" modelAttribute="editProfileContactVo" action="${ctx}/profile_edit?tab=contact" class="pe-contact-form">
			<form:errors path="*" element="div" cssClass="msg-error"/>
			<div class="fieldset">
				<label class="column of-five" for="pe-contact-emails" style="vertical-align: top;">Emails</label>
				<div class="double-column column of-five">
					<div><span><c:out value="${editProfileContactVo.email}"></c:out></span></div>
					<a href="${ctx}/account_settings">Add / Remove Emails</a>
				</div>
			</div>
			<div class="fieldset">
				<label class="column of-five" for="pe-contact-website">Website</label>
				<form:input path="website" id="pe-contact-website" name="pe-contact-website" class="double-column column of-five"/>
			</div>
			<div class="fieldset">
				<span class="column of-five"></span>
				<input type="submit" class="style3-button medium-button button" name="submit" value="Save Changes" id="pe-contact-save" />
			</div>
		</form:form>
	</div>
</c:if>